<template>
	<el-dialog v-model="visible" title="明细 " :close-on-click-modal='false' :close-on-press-escape='false'
		:fullscreen='true'>
		<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
			<!-- <el-form-item>
                            <el-input v-model="dataForm.id" placeholder="id" clearable></el-input>
                          </el-form-item> -->

			<el-form-item>
				<!-- <el-input v-model="dataForm.status" placeholder="状态" clearable></el-input> -->
				<el-select size="small" v-model="dataForm.status " placeholder="请选择">
					<el-option value="" label="--"> </el-option>
					<el-option v-for="item in checkStatus" :key="item.list" :label="item.listname"
						:value="reString(item.list)">
					</el-option>
				</el-select>
			</el-form-item>

			<el-form-item>
				<el-input size="small" v-model="dataForm.sku" placeholder="物料编码" clearable></el-input>
			</el-form-item>
			<el-form-item>
				<el-input  size="small" v-model="dataForm.descr" placeholder="物料名称" clearable></el-input>
			</el-form-item>
			<el-form-item>
				<el-input size="small" v-model="dataForm.lot" placeholder="批号" clearable></el-input>
			</el-form-item>
			<el-form-item>
				<el-input size="small" v-model="dataForm.location" placeholder="库位编码" clearable></el-input>
			</el-form-item>
			<el-form-item>
				<el-input size="small" v-model="dataForm.tray" placeholder="箱" clearable></el-input>
			</el-form-item>
			<el-form-item>
				<el-input size="small" v-model="dataForm.box" placeholder="格" clearable></el-input>
			</el-form-item>

			<el-form-item>
				<el-button size="small" @click="getDataList()">查询</el-button>
			</el-form-item>
			<!--  <el-form-item>
                            <el-button type="primary" @click="addOrUpdateHandle()">新增</el-button>
                          </el-form-item>
						  
						  <el-form-item>
						    <el-button type="primary" @click="saveHandle()">保存</el-button>
						  </el-form-item>
						  
                          <el-form-item>
                            <el-button type="danger" @click="deleteHandle()">删除</el-button>
                          </el-form-item> -->
			<el-form-item>
				<el-button size="small" type="info" @click="exportHandle()">导出</el-button>
			</el-form-item>
		</el-form>
		<el-table v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle"
			@sort-change="dataListSortChangeHandle" style="width: 100%;">
			<!-- <el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column> -->
			<!--  <el-table-column prop="id" label="序号"  header-align="center"
                                           align="center"></el-table-column> -->
			<el-table-column prop="checkkey" label="盘点号" header-align="center" align="center"></el-table-column>
			<el-table-column prop="line" label="行号" header-align="center" align="center"></el-table-column>
			<!--  <el-table-column prop="status" label="状态"  header-align="center"
                                           align="center"></el-table-column> -->
			<el-table-column prop="statusstr" label="状态" header-align="center" align="center"></el-table-column>
			<el-table-column prop="sku" label="物料" header-align="center" align="center"></el-table-column>
			<el-table-column prop="descr" label="物料名称" header-align="center" align="center"></el-table-column>
			<el-table-column prop="lot" label="批号" header-align="center" align="center"></el-table-column>
			<el-table-column prop="location" label="库位编码" header-align="center" align="center"></el-table-column>
			<el-table-column prop="tray" label="箱" header-align="center" align="center"></el-table-column>
			<el-table-column prop="box" label="格" header-align="center" align="center"></el-table-column>
			<el-table-column prop="qty" label="数量" header-align="center" align="center"></el-table-column>
			<el-table-column prop="firstqty" label="初盘数量" header-align="center" align="center">
			</el-table-column>
			<el-table-column prop="secondqty" label="复盘数量" header-align="center" align="center">

			</el-table-column>

			<el-table-column prop="lot1" label="生产日期" header-align="center" align="center"></el-table-column>
			<el-table-column prop="lot2" label="有效日期" header-align="center" align="center"></el-table-column>
			<!-- <el-table-column prop="lot3" label="属性3"  header-align="center"
                                           align="center"></el-table-column>
                                                    <el-table-column prop="lot4" label="属性4"  header-align="center"
                                           align="center"></el-table-column>
                                                    <el-table-column prop="lot5" label="属性5"  header-align="center"
                                           align="center"></el-table-column>
                                                    <el-table-column prop="lot6" label="属性6"  header-align="center"
                                           align="center"></el-table-column>
                                                    <el-table-column prop="lot7" label="属性7"  header-align="center"
                                           align="center"></el-table-column>
                                                    <el-table-column prop="lot8" label="属性8"  header-align="center"
                                           align="center"></el-table-column>
                                                    <el-table-column prop="lot9" label="属性9"  header-align="center"
                                           align="center"></el-table-column>
                                                    <el-table-column prop="lot10" label="属性10"  header-align="center"
                                           align="center"></el-table-column>
										   <el-table-column prop="firstuser" label="初盘人"  header-align="center"
										   align="center"></el-table-column>
										            <el-table-column prop="firsttime" label="初盘时间"  header-align="center"
										   align="center"></el-table-column>
										           
										            <el-table-column prop="seconduser" label="复盘人"  header-align="center"
										   align="center"></el-table-column>
										            <el-table-column prop="secondaddtime" label="复盘时间"  header-align="center"
										   align="center"></el-table-column>
                                               <el-table-column prop="remark" label="备注"  header-align="center"
                                           align="center"></el-table-column> -->

			<el-table-column type="expand" fixed="right" label="详情">
				<template #default="props">
					<el-form label-position="left" inline class="demo-table-expand">

						<el-row>
							<el-col :span="4">
								<el-form-item label="是否加长:">
									<span>{{ props.row.lot3 }}</span>
								</el-form-item>
							</el-col>
							<el-col :span="4">
								<el-form-item label="价格:">
									<span>{{ props.row.lot4 }}</span>
								</el-form-item>
							</el-col>
							<el-col :span="4">
								<el-form-item label="部门/供应商:">
									<span>{{ props.row.lot5 }}</span>
								</el-form-item>
							</el-col>
							<el-col :span="4">
								<el-form-item label="计划单号/工序号:">
									<span>{{ props.row.lot6 }}</span>
								</el-form-item>
							</el-col>
							<el-col :span="4">
								<el-form-item label="主制车间:">
									<span>{{ props.row.lot7 }}</span>
								</el-form-item>
							</el-col>
							<el-col :span="4">
								<el-form-item label="任务编码:">
									<span>{{ props.row.lot8 }}</span>
								</el-form-item>
							</el-col>
						</el-row>

						<el-row>
							<el-col :span="4">
								<el-form-item label="新旧:">
									<span>{{ props.row.lot9 }}</span>
								</el-form-item>
							</el-col>
							<el-col :span="4">
								<el-form-item label="作废:">
									<span>{{ props.row.lot10 }}</span>
								</el-form-item>
							</el-col>
							<el-col :span="4">
								<el-form-item label="炉批号:">
									<span>{{ props.row.lot11 }}</span>
								</el-form-item>
							</el-col>
							<el-col :span="4">
								<el-form-item label="材料复验号:">
									<span>{{ props.row.lot12 }}</span>
								</el-form-item>
							</el-col>
							<el-col :span="4">
								<el-form-item label="牌号:">
									<span>{{ props.row.lot13 }}</span>
								</el-form-item>
							</el-col>
							<el-col :span="4">
								<el-form-item label="属性14:">
									<span>{{ props.row.lot14 }}</span>
								</el-form-item>
							</el-col>
						</el-row>
						<el-row>
							<el-col :span="4">
								<el-form-item label="属性15:">
									<span>{{ props.row.lot15 }}</span>
								</el-form-item>
							</el-col>
							<el-col :span="4">
								<el-form-item label="初盘人">
									<span>{{ props.row.firstuser }}</span>
								</el-form-item>
							</el-col>
							<el-col :span="4">
								<el-form-item label="初盘时间:">
									<span>{{ props.row.firsttime}}</span>
								</el-form-item>
							</el-col>
							<el-col :span="4">
								<el-form-item label="复盘人:">
									<span>{{ props.row.seconduser}}</span>
								</el-form-item>
							</el-col>
							<el-col :span="4">
								<el-form-item label="复盘时间:">
									<span>{{ props.row.secondaddtime}}</span>
								</el-form-item>
							</el-col>

						</el-row>
						<el-row>
							<el-col :span="4">
								<el-form-item label="备注:">
									<span>{{ props.row.remark}}</span>
								</el-form-item>
							</el-col>

						</el-row>
					</el-form>
				</template>
			</el-table-column>


			<!--         <el-table-column prop="backstatus" label="回传状态"  header-align="center"
                                           align="center"></el-table-column>
                                                    <el-table-column prop="backdate" label="回传时间"  header-align="center"
                                           align="center"></el-table-column>
                                                    <el-table-column prop="backresult" label="回传结果"  header-align="center"
                                           align="center"></el-table-column>
                                                    <el-table-column prop="backcode" label="回传码"  header-align="center"
                                           align="center"></el-table-column>
                                                    <el-table-column prop="warehouse" label="仓库"  header-align="center"
                                           align="center"></el-table-column>
                                                    <el-table-column prop="adduser" label="创建人"  header-align="center"
                                           align="center"></el-table-column>
                                                    <el-table-column prop="addtime" label="创建时间"  header-align="center"
                                           align="center"></el-table-column>
                                                    <el-table-column prop="updatuser" label="修改人"  header-align="center"
                                           align="center"></el-table-column>
                                                    <el-table-column prop="updatetime" label="修改时间"  header-align="center"
                                           align="center"></el-table-column> -->
			<el-table-column label='操作' fixed="right" header-align="center" align="center" width="80">
				<template #default="scope">
					<!-- <el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button> -->
					<el-button type="text" size="small" v-if="!scope.row.lot  && hasPermission('lswms:check:delete') " @click="deleteHandle(scope.row.id)"  >删除
					</el-button>
				</template>
			</el-table-column>
		</el-table>
		<el-pagination :current-page="page" :page-sizes="[10, 20, 50, 100]" :page-size="limit" :total="total"
			layout="total, sizes, prev, pager, next, jumper" @size-change="pageSizeChangeHandle"
			@current-change="pageCurrentChangeHandle">
		</el-pagination>
		<!-- 弹窗, 新增 / 修改 -->
		<checkdetailAddOrUpdate v-if="addOrUpdateVisible" ref="addOrUpdate" @refresh-data-list="getDataList">
		</checkdetailAddOrUpdate>
	</el-dialog>
</template>

<script>
	import DataList from "@/utils/DataList";
	import {
		ref,
		reactive,
		onMounted,
		nextTick
	} from 'vue';
	import checkdetailAddOrUpdate from "@/components/lswms/check/CheckdetailAddOrUpdate";
	import {
		putCheckdetailEditUpdate
	} from '@/network/lswms/check/Checkdetail.js';
	import {
		getCodeListByCode
	} from "@/network/lswms/base/Codelist.js"
	import {
		ElMessage,
		ElMessageBox
	} from 'element-plus'

	//import {hasPermission} from "@/utils/hasPermission"
	export default {
		name: "checkdetail",

		components: {
			checkdetailAddOrUpdate,
		},

		setup() {
			const {
				dataForm,
				mixinViewModuleOptions,
				getDataList,
				dataList,
				total,
				page,
				limit,
				dataListLoading,
				dataListSelectionChangeHandle,
				dataListSortChangeHandle,
				pageSizeChangeHandle,
				pageCurrentChangeHandle,
				addOrUpdateHandle,
				deleteHandle,
				exportHandle,
				addOrUpdateVisible,
				dataListSelections,
				addOrUpdate
			} = DataList();

			onMounted(() => {
				mixinViewModuleOptions.value.getDataListIsPage = true;
				mixinViewModuleOptions.value.getDataListURL = '/lswms/checkdetail/page';
				mixinViewModuleOptions.value.deleteURL = '/lswms/checkdetail';
				mixinViewModuleOptions.value.exportURL = '/lswms/checkdetail/export';
				mixinViewModuleOptions.value.deleteIsBatchKey = 'id';
				mixinViewModuleOptions.value.deleteIsBatch = true

				dataForm.value = {
					checkkey: ''
				}
				getDataList();
			})

			const visible = ref(false);
			const init = () => {
				visible.value = true;
				checkStatusFn();
				nextTick(function() {
					//  dataFormRef.value.resetFields();
					// roleIdListDefault.value = [];
					if (dataForm.value.checkkey) {
						// dataForm.value.checkkey = checkkey;
						getDataList()
					}

				})
			}

			const saveHandle = () => {

				putCheckdetailEditUpdate(dataList.value).then((res) => {
					if (res.code !== 0) {
						return ElMessage.error(res.data.msg);
					}
					ElMessage({
						message: '操作成功',
						type: 'success',
						duration: 500,
						onClose: function() {
							getDataList();
						}
					});
				}).catch(function() {});
			}

			const checkStatus = ref("");

			const checkStatusFn = () => {

				getCodeListByCode('CheckStatus').then((res) => {
					if (res.code !== 0) {
						return ElMessage.error(res.msg);
					}
					checkStatus.value = res.data;
				}).catch((err) => {});
			}

			return {
				dataForm,
				mixinViewModuleOptions,
				getDataList,
				dataList,
				total,
				page,
				limit,
				dataListLoading,
				dataListSelectionChangeHandle,
				dataListSortChangeHandle,
				pageSizeChangeHandle,
				pageCurrentChangeHandle,
				addOrUpdateHandle,
				deleteHandle,
				exportHandle,
				addOrUpdateVisible,
				dataListSelections,
				addOrUpdate,
				init,
				visible,
				saveHandle,
				checkStatus
			}
		},
		methods: {
			//hasPermission

			reString: function(val) {
				let n = Number(val)
				if (!isNaN(n)) {
					return n
				} else {
					return val
				}
			}
		}
	}
</script>

<style scoped>

</style>
